<template>
  <div class="app-container">

    <!--列表数据  -->
    <el-table :data="list" border fit highlight-current-row style="width: 100%;">
      <el-table-column label="车款车型" prop="carModel" align="center"/>
      <el-table-column label="订单类型" prop="puzzlingQuestion" align="center"/>
      <el-table-column label="协助内容" prop="requiredContents" align="center"/>
      <el-table-column label="是否为工程师" prop="isEngineer" align="center" >
        <template scope="scope">
          <span v-for="(item,index) in orderStatusList" >{{scope.row.orderStatus===item.id?item.name:''}}</span>
        </template>

      </el-table-column>
      <el-table-column label="佣金" prop="payableRecord" align="center">
        <template scope="scope">
          <span>{{scope.row.payableRecord?scope.row.payableRecord.totalFee/100:'暂无佣金'}}</span>
        </template>
      </el-table-column>
      <el-table-column label="小费" prop="tipRecord" align="center">
        <template scope="scope">
        <span>{{scope.row.tipRecord?scope.row.tipRecord.totalFee/100:'暂无小费'}}</span>
        </template>
      </el-table-column>
      <el-table-column label="接单时间" prop="receiverTime" align="center">
        <template scope="scope">
          <span>{{scope.row.receiverTime?scope.row.receiverTime:'暂未接单'}}</span>
        </template>
      </el-table-column>
      <el-table-column label="发布时间" prop="createTime" align="center"/>

    </el-table>
    <!-- 底部分页 -->
    <pagination v-show="count > 0" align="center" :total="count" :page.sync="listQuery.page"
                :limit.sync="listQuery.size" @pagination="getList(listQuery.page,listQuery.size)"/>



  </div>
</template>
<script>
  // 后台接口数据
  import {getOrderList} from '@/api/order'
  import Pagination from '@/components/Pagination'
  export default {
    name: 'orderList',
    components: {Pagination},
    data() {
      return {
        listQuery:{
          page:1,
          size:10
        },
        count:0,
        list:[],
        orderStatusList:[{id:0,name:'创建等待支付'},{id:1,name:'等待接单'},{id:2,name:'已被接单'},{id:3,name:'已被撤回'},{id:4,name:'已完成'},{id:5,name:'部分完成'},{id:6,name:'未完成'},{id:7,name:'完成已评价'}]
      }
    },

    created() {
      this.getList(1,10)
    },

    methods: {

      getList(page, size) {
        var params = {
          page: page,
          size: size,
        }
        // 得到所有用户的接口
        getOrderList(params).then(res => {
          this.list = res.data
          this.count = res.count
          this.listQuery.page=page
          this.listQuery.size=size
        })
          .catch(err => {
          })
      }
    }
  }
</script>
<style>


</style>

